<template>
  <view :style="[boxStyle]">
    <view>
      <view v-if="goodsFilterConfig==0" class="h-88 px-32 flex-between-center relative">
        <view class="text--w111-333 fs-26 fw-500 flex-y-center" @tap="toggleSortable">
          <text>综合排序</text>
          <text class="iconfont icon-ic_down2 fs-14 ml-6"></text>
        </view>
        <view class="text--w111-666 flex-y-center fs-26" @tap='set_where(3)'>
          <text :class="[1,2].includes(stock) ? 'text-primary-con' : ''">销量</text>
          <text v-if="stock==2" class="iconfont icon-ic_down2 fs-14 ml-6 text-primary-con"></text>
          <text v-if="stock==1" class="iconfont icon-ic_up2 fs-14 ml-6 text-primary-con"></text>
          <text v-if="stock==0" class="iconfont icon-ic_down2 fs-14 ml-6"></text>
        </view>
        <view class="text--w111-666 flex-y-center fs-26" @tap='set_where(2)'>
          <text :class="[1,2].includes(price) ? 'text-primary-con' : ''">价格</text>
          <text v-if="price==2" class="iconfont icon-ic_down2 fs-14 ml-6 text-primary-con"></text>
          <text v-if="price==1" class="iconfont icon-ic_up2 fs-14 ml-6 text-primary-con"></text>
          <text v-if="price==0" class="iconfont icon-ic_down2 fs-14 ml-6"></text>
        </view>
        <view class="text--w111-666 flex-y-center fs-26">
          <text class="menu_line"></text>
          <view @tap="showFilterDrawer = true">筛选</view>
          <text class="iconfont icon-ic_sort pl-8" @tap="showFilterDrawer = true"></text>
        </view>
        <view class="sortable-box w-full bg--w111-fff rd-b-24rpx z-999" v-if="showSortAbleBox">
          <view class="flex-between-center pb-40"
                v-for="(item, index) in sortableShowTab" :key="index" @tap="checkSortable(item.value)">
            <text class="fs-26" :class="item.value == where.defaultOrder ? 'text-primary-con' : 'text--w111-333'">{{item.title}}</text>
            <image class="w-28 h-28" :src="require('@/pages/goods/static/dui-icon.png')" v-if="item.value == where.defaultOrder"></image>
          </view>
        </view>

      </view>
      <!-- 单列 -->
      <view v-if="goodStyleConfig == 0">
        <view class="w-full flex justify-between item bg--w111-fff p-20 rd-16rpx"
              v-for="(item,index) in tempArr" :key="index"
              @tap="goDetail(item)">
          <easy-loadimage
              :image-src="item.image"
              :borderSrc="item.activity_frame.image"
              width="224rpx"
              height="224rpx"
              :borderRadius="imgStyle"></easy-loadimage>
          <view class="flex-1 flex-col justify-between pl-20">
            <view class="w-full fs-28 h-80 lh-40rpx line2"
                  v-if="checkboxInfo.includes(0)" :style="[productStyle]">
<!--              <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
              <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>
              {{item.store_name}}</view>
            <view class="flex items-end flex-wrap mt-8 w-full" v-if="checkboxInfo.includes(1)">
              <BaseTag
                  :text="label.label_name"
                  :color="label.color"
                  :background="label.bg_color"
                  :borderColor="label.border_color"
                  :circle="label.border_color ? true : false"
                  :imgSrc="label.icon"
                  v-for="(label, idx) in item.store_label" :key="idx"></BaseTag>
            </view>
            <view class="flex-between-center" v-if="onlyShowPrice">
              <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                         :color="priceColor"></baseMoney>
<!--              <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
<!--                <view class="w-96 h-56 rd-28rpx flex-center fs-24 text&#45;&#45;w111-fff"-->
<!--                      v-if="btnStyle == 0" :style="[btnBgColor]">购买</view>-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else-if="btnStyle == 1">-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_increase fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--              </view>-->
            </view>
            <view v-else>
              <view class="flex-y-center mt-4">
                <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                           :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
                <view class="inline-block h-26 lh-28rpx rd-14rpx bg--w111-F7E9CD fs-22 ml-8"
                      v-if="Number(item.vip_price) > 0 && item.is_vip && checkboxInfo.includes(5)">
                  <text class="inline-block h-26 lh-28rpx svip_rd fs-18 bg--w111-484643 text--w111-FDDAA4 px-8">SVIP</text>
                  <text class="px-8 fs-22" v-if="['All','lease'].includes(goodsType[item.lease_type])">¥{{item.vip_day_price}}/天</text>
                  <text class="px-8 fs-22" v-else>¥{{item.vip_price}}</text>
                </view>
              </view>
<!--              <view class="flex justify-between items-end">-->
<!--                <view class="flex-y-center">-->
<!--                  <text class="fs-22 text&#45;&#45;w111-999" v-if="checkboxInfo.includes(3)">已售{{item.sales}}{{item.unit_name}}</text>-->
<!--                  <text class="fs-22 text&#45;&#45;w111-999 pl-16" v-if="checkboxInfo.includes(4)">评分{{item.star}}</text>-->
<!--                </view>-->
<!--                <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
<!--                  <view class="w-96 h-56 rd-28rpx flex-center fs-24 text&#45;&#45;w111-fff"-->
<!--                        v-if="btnStyle == 0" :style="[btnBgColor]">购买</view>-->
<!--                  <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else-if="btnStyle == 1">-->
<!--                    <view class="flex-center cart-btn">-->
<!--                      <text class="iconfont icon-ic_increase fs-26"></text>-->
<!--                    </view>-->
<!--                  </view>-->
<!--                  <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
<!--                    <view class="flex-center cart-btn">-->
<!--                      <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
<!--                    </view>-->
<!--                  </view>-->
<!--                </view>-->
<!--              </view>-->
            </view>

          </view>
        </view>
      </view>
      <!-- 两列展示(纵向) -->
      <view class="wf-page fs-regular" v-if="goodStyleConfig == 1">
        <!-- left -->
        <view>
          <view id="left" v-if="leftList.length">
            <view v-for="(item,index) in leftList" :key="index">
<!--              广告-->
              <view v-if="item.isAd" class="wf-item" style="border: none">
                <indexGoodsAd :advData="item.adData"></indexGoodsAd>
              </view>
<!--              商品-->
              <view v-if="!item.isAd" :style="{'border-radius':imgStyle}" class="wf-item" @tap="goDetail(item)">
                <view class='pictrue'>
  <!--                :borderRadius="imgStyle"-->
                  <easy-loadimage
                      mode="widthFix"
                      :image-src="item.image"
                      :borderSrc="item.activity_frame.image"
                      width="100%"
                      height="346rpx"
                     ></easy-loadimage>
                </view>
                <view class="info_box">
                  <view class="w-full line2 text--w111-333 lh-40rpx mb-38"
                        v-if="checkboxInfo.includes(0)" :style="[productStyle]">
  <!--                  <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
                      <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>

                    {{item.store_name}}
                  </view>
                  <view class="flex items-end flex-wrap mt-8 w-full" v-if="checkboxInfo.includes(1)">
                    <BaseTag
                        :text="label.label_name"
                        :color="label.color"
                        :background="label.bg_color"
                        :borderColor="label.border_color"
                        :circle="label.border_color ? true : false"
                        :imgSrc="label.icon"
                        v-for="(label, idx) in item.store_label" :key="idx"></BaseTag>
                  </view>
                  <!-- 1 只显示价格 -->
                  <view class="flex-between-center mt-20 price-box" v-if="onlyShowPrice">
                    <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                               :color="priceColor"></baseMoney>
  <!--                  <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
  <!--                    <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
  <!--                      <view class="flex-center cart-btn">-->
  <!--                        <text class="iconfont icon-ic_increase fs-26"></text>-->
  <!--                      </view>-->
  <!--                    </view>-->
  <!--                    <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
  <!--                      <view class="flex-center cart-btn">-->
  <!--                        <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
  <!--                      </view>-->
  <!--                    </view>-->
  <!--                  </view>-->
                  </view>
                  <!-- 2 显示价格，其他 -->
                  <view v-else>
                    <view class="flex-y-center flex-wrap mt-8 price-box">
                      <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                                 :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
                      <view class="inline-block h-26 lh-28rpx rd-14rpx bg--w111-F7E9CD fs-18 ml-8" v-if="Number(item.vip_price) > 0 && item.is_vip && checkboxInfo.includes(5)">
                        <text class="inline-block h-26 lh-28rpx svip_rd bg--w111-484643 text--w111-FDDAA4 px-8">SVIP</text>
                        <text class="px-8" v-if="['All','lease'].includes(goodsType[item.lease_type])">¥{{item.vip_day_price}}/天</text>
                        <text class="px-8" v-else>¥{{item.vip_price}}</text>
                      </view>
                    </view>
  <!--                  <view class="flex-between-center mt-20">-->
  <!--                    <text class="fs-22 text&#45;&#45;w111-999" v-if="checkboxInfo.includes(3)">已售{{item.sales}}{{item.unit_name}}</text>-->
  <!--                    <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
  <!--                      <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
  <!--                        <view class="flex-center cart-btn">-->
  <!--                          <text class="iconfont icon-ic_increase fs-26"></text>-->
  <!--                        </view>-->
  <!--                      </view>-->
  <!--                      <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
  <!--                        <view class="flex-center cart-btn">-->
  <!--                          <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
  <!--                        </view>-->
  <!--                      </view>-->
  <!--                    </view>-->
  <!--                  </view>-->
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>
        <!-- right -->
        <view>
          <view id="right" v-if="rightList.length">
            <view v-for="(item,index) in rightList" :key="index">
              <!--              广告-->
              <view v-if="item.isAd" class="wf-item" style="border: none">
                <indexGoodsAd :advData="item.adData"></indexGoodsAd>
              </view>
              <!--              商品-->
              <view v-if="!item.isAd" :style="{'border-radius':imgStyle}" class="wf-item" @tap="goDetail(item)">
                <view class='pictrue'>
                  <!--                :borderRadius="imgStyle"-->
                  <easy-loadimage
                      mode="widthFix"
                      :image-src="item.image"
                      :borderSrc="item.activity_frame.image"
                      width="100%"
                      height="346rpx"
                  ></easy-loadimage>
                </view>
                <view class="info_box">
                  <view class="w-full line2 text--w111-333 lh-40rpx mb-38"
                        v-if="checkboxInfo.includes(0)" :style="[productStyle]">
                    <!--                  <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
                    <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>

                    {{item.store_name}}
                  </view>
                  <view class="flex items-end flex-wrap mt-8 w-full" v-if="checkboxInfo.includes(1)">
                    <BaseTag
                        :text="label.label_name"
                        :color="label.color"
                        :background="label.bg_color"
                        :borderColor="label.border_color"
                        :circle="label.border_color ? true : false"
                        :imgSrc="label.icon"
                        v-for="(label, idx) in item.store_label" :key="idx"></BaseTag>
                  </view>
                  <!-- 1 只显示价格 -->
                  <view class="flex-between-center mt-20 price-box" v-if="onlyShowPrice">
                    <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                               :color="priceColor"></baseMoney>
                    <!--                  <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
                    <!--                    <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
                    <!--                      <view class="flex-center cart-btn">-->
                    <!--                        <text class="iconfont icon-ic_increase fs-26"></text>-->
                    <!--                      </view>-->
                    <!--                    </view>-->
                    <!--                    <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
                    <!--                      <view class="flex-center cart-btn">-->
                    <!--                        <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
                    <!--                      </view>-->
                    <!--                    </view>-->
                    <!--                  </view>-->
                  </view>
                  <!-- 2 显示价格，其他 -->
                  <view v-else>
                    <view class="flex-y-center flex-wrap mt-8 price-box">
                      <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                                 :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
                      <view class="inline-block h-26 lh-28rpx rd-14rpx bg--w111-F7E9CD fs-18 ml-8" v-if="Number(item.vip_price) > 0 && item.is_vip && checkboxInfo.includes(5)">
                        <text class="inline-block h-26 lh-28rpx svip_rd bg--w111-484643 text--w111-FDDAA4 px-8">SVIP</text>
                        <text class="px-8" v-if="['All','lease'].includes(goodsType[item.lease_type])">¥{{item.vip_day_price}}/天</text>
                        <text class="px-8" v-else>¥{{item.vip_price}}</text>
                      </view>
                    </view>
                    <!--                  <view class="flex-between-center mt-20">-->
                    <!--                    <text class="fs-22 text&#45;&#45;w111-999" v-if="checkboxInfo.includes(3)">已售{{item.sales}}{{item.unit_name}}</text>-->
                    <!--                    <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
                    <!--                      <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
                    <!--                        <view class="flex-center cart-btn">-->
                    <!--                          <text class="iconfont icon-ic_increase fs-26"></text>-->
                    <!--                        </view>-->
                    <!--                      </view>-->
                    <!--                      <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
                    <!--                        <view class="flex-center cart-btn">-->
                    <!--                          <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
                    <!--                        </view>-->
                    <!--                      </view>-->
                    <!--                    </view>-->
                    <!--                  </view>-->
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <!-- 两列展示(横向) -->
      <view class="pt-32 pr-24 pb-32 pl-24 bg--w111-fff rd-16rpx" v-if="goodStyleConfig == 3">
        <view class="grid-column-2 grid-gap-20rpx">
          <view class="flex" v-for="(item,index) in tempArr" :key="index" @tap="goDetail(item)">
            <easy-loadimage
                mode="widthFix"
                :image-src="item.image"
                :borderSrc="item.activity_frame.image"
                width="144rpx"
                height="144rpx"
                :borderRadius="imgStyle"></easy-loadimage>
            <view class="flex-1 pl-20">

              <view class="w-full fs-26 h-72 lh-36rpx line2 mb-20"
                    v-if="checkboxInfo.includes(0)" :style="[productStyle]">
<!--                <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
                <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>
                {{item.store_name}}</view>
              <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                         :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
            </view>
          </view>
        </view>
      </view>
      <!-- 三列 -->
      <view class="pt-32 pr-24 pb-32 pl-24 bg--w111-fff rd-16rpx" v-if="goodStyleConfig == 2">
        <view class="grid-column-3 grid-gap-20rpx">
          <view v-for="(item,index) in tempArr" :key="index" @tap="goDetail(item)">
            <easy-loadimage
                mode="widthFix"
                :image-src="item.image"
                :borderSrc="item.activity_frame.image"
                width="100%"
                height="210rpx"
                :borderRadius="imgStyle"></easy-loadimage>

            <view class="w-full fs-28 h-80 lh-40rpx line2 mt-20 mb-20"
                  v-if="checkboxInfo.includes(0)" :style="[productStyle]">
<!--              <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
              <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>
              {{item.store_name}}</view>
            <view class="flex-between-center mt-14">
              <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                         :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
<!--              <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_increase fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--              </view>-->
            </view>
          </view>
        </view>
      </view>
      <!-- 大图展示 -->
      <view v-if="goodStyleConfig ==4">
        <view class="w-full item" v-for="(item,index) in tempArr" :key="index" @tap="goDetail(item)">
          <easy-loadimage
              mode="widthFix"
              :image-src="item.image"
              width="100%"
              height="360rpx"
              :borderRadius="imgStyle"></easy-loadimage>
          <view class="rd-b-24rpx p-24 bg--w111-fff">

            <view class="w-full line2 fs-28 text--w111-333 lh-40rpx mt-22 mb-38"
                  v-if="checkboxInfo.includes(0)" :style="[productStyle]">
<!--              <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
              <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>
              {{item.store_name}}</view>
            <view class="flex items-end flex-wrap mt-8 w-full" v-if="checkboxInfo.includes(1)">
              <BaseTag
                  :text="label.label_name"
                  :color="label.color"
                  :background="label.bg_color"
                  :borderColor="label.border_color"
                  :circle="label.border_color ? true : false"
                  :imgSrc="label.icon"
                  v-for="(label, idx) in item.store_label" :key="idx"></BaseTag>
            </view>
            <view class="flex-between-center" v-if="onlyShowPrice">
              <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                         :color="priceColor"></baseMoney>
<!--              <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
<!--                <view class="w-96 h-56 rd-28rpx flex-center fs-24 text&#45;&#45;w111-fff"-->
<!--                      v-if="btnStyle == 0" :style="[btnBgColor]">购买</view>-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else-if="btnStyle == 1">-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_increase fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
<!--                  <view class="flex-center cart-btn">-->
<!--                    <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
<!--                  </view>-->
<!--                </view>-->
<!--              </view>-->
            </view>
            <view v-else>
              <view class="flex-y-center mt-8">
                <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                           :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
                <view class="inline-block h-26 lh-28rpx rd-14rpx bg--w111-F7E9CD fs-22 ml-8"
                      v-if="Number(item.vip_price) > 0 && item.is_vip && checkboxInfo.includes(5)">
                  <text class="inline-block h-26 lh-28rpx svip_rd fs-18 bg--w111-484643 text--w111-FDDAA4 px-8">SVIP</text>
                  <text class="px-8 fs-22" v-if="['All','lease'].includes(goodsType[item.lease_type])">¥{{item.vip_day_price}}/天</text>
                  <text class="px-8 fs-22" v-else>¥{{item.vip_price}}</text>
                </view>
              </view>
              <view class="flex justify-between items-end">
<!--                <view class="flex-y-center">-->
<!--                  <text class="fs-22 text&#45;&#45;w111-999" v-if="checkboxInfo.includes(3)">已售{{item.sales}}{{item.unit_name}}</text>-->
<!--                  <text class="fs-22 text&#45;&#45;w111-999 pl-16" v-if="checkboxInfo.includes(4)">评分{{item.star}}</text>-->
<!--                </view>-->
<!--                <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
<!--                  <view class="w-96 h-56 rd-28rpx flex-center fs-24 text&#45;&#45;w111-fff"-->
<!--                        v-if="btnStyle == 0" :style="[btnBgColor]">购买</view>-->
<!--                  <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else-if="btnStyle == 1">-->
<!--                    <view class="flex-center cart-btn">-->
<!--                      <text class="iconfont icon-ic_increase fs-26"></text>-->
<!--                    </view>-->
<!--                  </view>-->
<!--                  <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
<!--                    <view class="flex-center cart-btn">-->
<!--                      <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
<!--                    </view>-->
<!--                  </view>-->
<!--                </view>-->
              </view>
            </view>
          </view>
        </view>
      </view>
      <!-- 横向滑动 -->
      <view class="heng-box fs-regular pt-32 pb-32 pl-24 bg--w111-fff rd-16rpx" v-if="goodStyleConfig == 5">
        <scroll-view scroll-x="true" show-scrollbar="false"
                     class="white-nowrap vertical-middle w-full">
          <view class="flex">
            <view class="heng-item inline-block mr-10" :style="{'border-radius':imgStyle}" v-for="(item,index) in tempArr" :key="index" @tap="goDetail(item)">
  <!--            :borderRadius="imgStyle"-->
              <easy-loadimage
                  mode="widthFix"
                  :image-src="item.image"
                  :borderSrc="item.activity_frame.image"
                  width="300rpx"
                  height="300rpx"
                  ></easy-loadimage>

              <view class="px-20 w-300 h-80 lh-40rpx line2 break_word mt-20"
                    v-if="checkboxInfo.includes(0)" :style="[productStyle]">
  <!--              <zeroTag v-if="item.is_super === 1" ></zeroTag>-->
                <secondHandTag :lease_type="item.lease_type" :new_old="item.new_old" :level="item.level"></secondHandTag>
                {{item.store_name}}
              </view>
              <view class="h-80 pl-20 pr-20 pb-20 flex-between-center">
                <baseMoney :money="getPrice(item)" :leaseType="item.lease_type" symbolSize="24" integerSize="40" decimalSize="24" weight
                           :color="priceColor" v-if="checkboxInfo.includes(2)"></baseMoney>
  <!--              <view @tap.stop="addCartChange(item, index)" v-if="!showBtn">-->
  <!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-if="btnStyle == 0">-->
  <!--                  <view class="flex-center cart-btn">-->
  <!--                    <text class="iconfont icon-ic_increase fs-26"></text>-->
  <!--                  </view>-->
  <!--                </view>-->
  <!--                <view class="rd-24rpx w-44 h-44" :style="[btnTextColor]" v-else>-->
  <!--                  <view class="flex-center cart-btn">-->
  <!--                    <text class="iconfont icon-ic_ShoppingCart1 fs-26"></text>-->
  <!--                  </view>-->
  <!--                </view>-->
  <!--              </view>-->
              </view>
            </view>

            <!-- 横向：查看更多 -->

            <view class="heng-item-more inline-block mr-10" v-if="lookMoreLink.tabVal==0 && tempArr.length>0" >
              <view class="more-btn" @click="jump(lookMoreLink.link)">
                <view>查</view>
                <view>看</view>
                <view>全</view>
                <view>部</view>
              </view>
            </view>
          </view>
        </scroll-view>
      </view>

      <!-- 纵向：查看更多 -->
      <view class="bottom-more" v-if="lookMoreLink.tabVal==0 && goodStyleConfig!=5 && tempArr.length>0" >
        <view class="more-btn" @click="jump(lookMoreLink.link)">
          查看全部 <text class="ebao-iconfont ebao-youjiantou"></text>
        </view>
      </view>
    </view>
<!--    <productWindow-->
<!--        v-if="storeInfo.id"-->
<!--        :attr="attr"-->
<!--        :attrValue="attrValue"-->
<!--        :storeInfo="storeInfo"-->
<!--        :isShow='1'-->
<!--        :iSplus='1'-->
<!--        :iScart='1'-->
<!--        :fangda="false"-->
<!--        type="2"-->
<!--        @myevent="onMyEvent"-->
<!--        @ChangeAttr="ChangeAttr" @ChangeCartNum="ChangeCartNumDuo" @attrVal="attrVal"-->
<!--        @iptCartNum="iptCartNum" @goCat="goCatNum" id='product-window' :is_vip="is_vip"></productWindow>-->
    <filterDrawer
        :visible="showFilterDrawer"
        :promotionId="where.promotions_id"
        :brandList="brandList"
        :labelList="labelList"
        :promotionList="promotionList"
        @closeDrawer="()=>{showFilterDrawer = false}"
        @filterChange="filterConfirm"></filterDrawer>
  </view>
</template>

<script>
import indexGoodsAd from '@/components/systemAD/indexGoodsAd.vue'
import {getProductslist, getAttr, searchFilterApi} from '@/api/store.js';
import skuSelect from '@/mixins/skuSelect.js'
import { toLogin } from '@/libs/login.js';
import { mapGetters, mapState } from 'vuex';
import { getCartCounts } from '@/api/order.js';
import { goShopDetail } from '@/libs/order.js';
// import productWindow from '@/components/productWindow';
import {getPrice, goodsType} from "@/tools/goods";
import secondHandTag from "@/components/secondHandTag/index.vue";
import zeroTag from "@/components/zeroTag/index.vue";
import filterDrawer from "@/pages/goods/components/filterDrwer/index.vue";
import {getIndexGoodsAd} from "@/api/leaseOrder";
export default {
  name: 'goodList',
  props: {
    dataConfig: {
      type: Object,
      default: () => {}
    },
    isSortType: {
      type: String | Number,
      default: 0
    },
    indexTitle:{default:''},
    showAd:{
      default: false
    }
  },
  components: {
    filterDrawer,
    // productWindow,
    secondHandTag,
    zeroTag,
    indexGoodsAd
  },
  mixins: [skuSelect],
  data() {
    return {
      goodsType,
      // 筛选 start
      showSortAbleBox:false,
      price: 0,
      stock: 0,
      nows: false,
      loadend: false,
      loading: false,
      loadTitle: '加载更多',
      sortableShowTab:[
        {title:'综合排序',value:0},
        {title:'好评优先',value:1},
        {title:'新品优先',value:2},
      ],
      is_switch: true,
      showFilterDrawer:false,
      brandList: [],
      promotionList:[],
      labelList:[],
      where: {
        sid: 0,
        keyword: '',
        priceOrder: '',
        salesOrder: '',
        news: 0,
        cid: 0,
        tid: 0,
        brand_id: '',
        promotions_id: 0,
        promotions_type:0,
        defaultOrder:0,
        super_id:''
      },
      // end

      tempArr: [],
      type:0,
      attr: {
        goodsType:'lease', // 商品类型
        goodsTypeSelect:'lease', // 选择的类型
        cartAttr: false,
        productAttr:{
          mall:'', // 商城规格属性
          lease:'' // 租赁规格属性
        },
        productSelect: {
          mall:{},  // 商城规格选中值
          lease:{}  // 租赁规格选中值
        },
        deliveryType:[]
      },
      id: 0,
      productValue: [],
      //已选属性key
      attrValue: {
        mall:'',
        lease:''
      },
      storeName: '', //多属性产品名称
      is_vip: 0, //是否是会员
      storeInfo: {},
      allList: [],       // 全部列表
      leftList: [],      // 左边列表
      rightList: [],     // 右边列表
      mark: 0,           // 列表标记
      boxHeight: [],     // 下标0和1分别为左列和右列高度
    };
  },
  watch: {
    showFilterDrawer(){
      if(this.showFilterDrawer){
        uni.setNavigationBarTitle({
          title: ''
        });
      }else{
        uni.setNavigationBarTitle({
          title: this.indexTitle
        });
      }
    },
    // 监听列表数据变化
    tempArr:  {
      handler(nVal,oVal){
        // 如果数据为空或新的列表数据少于旧的列表数据（通常为下拉刷新或切换排序或使用筛选器），初始化变量
        if (!this.tempArr.length ||
            (this.tempArr.length === this.updateNum && this.tempArr.length <= this.allList.length)) {
          this.allList = [];
          this.leftList = [];
          this.rightList = [];
          this.boxHeight = [];
          this.mark = 0;
        }
        // 如果列表有值，调用waterfall方法

        if (this.tempArr.length) {
          this.allList = this.tempArr;
          this.leftList = [];
          this.rightList = [];
          this.boxHeight = [];
          this.allList.forEach((v, i) => {
            if(this.allList.length < 3 || (this.allList.length <= 7  && this.allList.length - i > 1) || (this.allList.length > 7 && this.allList.length - i > 2)) {
              if(i % 2){
                this.rightList.push(v);
              }else{
                this.leftList.push(v);
              }
            }
          });
          if(this.allList.length < 3){
            this.mark = this.allList.length+1;
          }else if(this.allList.length <= 7){
            this.mark = this.allList.length - 1;
          }else{
            this.mark = this.allList.length - 2;
          }
          if(this.mark < this.allList.length){
            this.waterFall()
          }
        }
      },
      immediate: true,
      deep:true
    },
    // 监听标记，当标记发生变化，则执行下一个item排序
    mark() {
      const len = this.allList.length;
      if (this.mark < len && this.mark !== 0 && this.boxHeight.length) {
        this.waterFall();
      }
    },
    dataConfig() {
      this.productslist();
    }
  },
  computed:{
    ...mapState({
      cartNum: state => state.indexData.cartNum
    }),
    ...mapGetters(['isLogin', 'uid', 'cartNum']),
    /*外层盒子样式*/
    boxStyle(){
      let borderRadius = `${this.dataConfig.fillet.val * 2}rpx`;
      if (this.dataConfig.fillet.type) {
        borderRadius =
            `${this.dataConfig.fillet.valList[0].val * 2}rpx ${this.dataConfig.fillet.valList[1].val * 2}rpx ${this.dataConfig.fillet.valList[2].val * 2}rpx ${this.dataConfig.fillet.valList[3].val * 2}rpx`;
      }
      return {
        borderRadius,
        padding: `${this.dataConfig.topConfig.val * 2}rpx ${this.dataConfig.prConfig.val * 2}rpx ${this.dataConfig.bottomConfig.val * 2}rpx`,
        marginTop: `${this.dataConfig.mbConfig.val * 2}rpx`,
        background: this.dataConfig.bottomBgColor.color[0].item,
      }
    },
    /*内层盒子样式*/
    // boxContentStyle() {
    // 	let borderRadius = `${this.dataConfig.fillet.val * 2}rpx`;
    // 	if (this.dataConfig.fillet.type) {
    // 		borderRadius =
    // 			`${this.dataConfig.fillet.valList[0].val * 2}rpx ${this.dataConfig.fillet.valList[1].val * 2}rpx ${this.dataConfig.fillet.valList[2].val * 2}rpx ${this.dataConfig.fillet.valList[3].val * 2}rpx`;
    // 	}
    // 	return {
    // 		borderRadius,
    // 		background: this.dataConfig.bottomBgColor.color[0].item
    // 	};
    // },
    styleConfig(){
      return this.dataConfig.styleConfig.tabVal
    },
    /*商品图片圆角样式*/
    imgStyle(){
      let borderRadius = `${this.dataConfig.filletImg.val * 2}rpx`;
      if (this.dataConfig.styleConfig.tabVal == 1) {
        // borderRadius = `${this.dataConfig.filletImg.val * 2}rpx ${this.dataConfig.filletImg.val * 2}rpx 0 0`;
        // 卡片圆角
        borderRadius = `${this.dataConfig.filletImg.val * 2}rpx`;
      }
      if (this.dataConfig.filletImg.type) {
        borderRadius =
            `${this.dataConfig.filletImg.valList[0].val * 2}rpx ${this.dataConfig.filletImg.valList[1].val * 2}rpx ${this.dataConfig.filletImg.valList[2].val * 2}rpx ${this.dataConfig.filletImg.valList[3].val * 2}rpx`;
        if (this.dataConfig.styleConfig.tabVal == 1) {
          borderRadius = `${this.dataConfig.filletImg.valList[0].val * 2}rpx ${this.dataConfig.filletImg.valList[1].val * 2}rpx 0 0`;
        }
      }
      return borderRadius
    },
    /*商品名称样式*/
    productStyle(){
      return {
        color: this.dataConfig.goodsNameColor.color[0].item,
        fontWeight: this.dataConfig.goodsName.tabVal ? 'normal' : '500'
      }
    },
    /* 展示信息 */
    checkboxInfo(){
      return this.dataConfig.checkboxInfo.type
    },
    /* 价格颜色 */
    priceColor(){
      return this.dataConfig.toneConfig.tabVal ? this.dataConfig.goodsPriceColor.color[0].item : 'var(--view-theme)'
    },
    /* 原价颜色 */
    otPriceColor(){
      return this.dataConfig.goodsPriceColor.color[0].item
    },
    btnStyle(){
      return this.dataConfig.bntStyleConfig.tabVal
    },
    // 购物车按钮 true 隐藏
    showBtn(){
      return true
      // return this.dataConfig.cartConfig.tabVal
    },
    /* 按钮颜色 */
    btnBgColor(){
      return {
        background: this.dataConfig.toneConfig.tabVal ? `linear-gradient(90deg,${this.dataConfig.bntBgColor.color[0].item} 0%,${this.dataConfig.bntBgColor.color[1].item} 100%)`: 'linear-gradient(90deg, var(--view-theme) 0%, var(--view-gradient) 100%)'
      }
    },
    btnTextColor(){
      return {
        color: this.dataConfig.toneConfig.tabVal ? this.dataConfig.bntBgColor.color[0].item: '#FFFFFF',
        background: this.dataConfig.toneCartConfig.tabVal ? `linear-gradient(90deg, ${this.dataConfig.bntBgColor.color[0].item} 0%, ${this.dataConfig.bntBgColor.color[1].item} 100%)` : 'linear-gradient(90deg, var(--view-theme) 0%, var(--view-gradient) 100%)',
      }
    },
    /*商品数量*/
    numberConfig(){
      return this.dataConfig.numberConfig.val
    },
    /*商品筛选*/
    goodsFilterConfig(){
      if(this.dataConfig.goodsFilter){
        return this.dataConfig.goodsFilter.tabVal
      }else{
        return 1
      }
    },
    // 商品-查看更多
    lookMoreLink(){
      if(this.dataConfig.lookMoreLink){
        return this.dataConfig.lookMoreLink
      }else{
        return {}
      }
    },
    /*商品模板*/
    goodStyleConfig(){
      return this.dataConfig.styleConfig.tabVal
    },
    /*检索条件  0综合 1销量 2价格*/
    goodsSort(){
      return this.dataConfig.goodsSort.tabVal
    },
    /*按照什么方式选择商品 0 指定商品 1 指定品牌 2指定分类 3 商品标签 */
    typeConfig(){
      return this.dataConfig.typeConfig.activeValue
    },
    bntConfig(){
      return this.dataConfig.bntConfig.tabVal
    },
    onlyShowPrice(){
      if(this.checkboxInfo.toString()  == '0,2' || this.checkboxInfo.toString()  == '2,0' || this.checkboxInfo.toString()  == '2'){
        return true
      }else{
        return false
      }
    }
  },
  created() {
    // #ifndef APP-PLUS
    // this.$eventHub.$on('product_video_observe', () => {
    // 	this.observeVideo();
    // });
    // #endif
  },
  mounted() {
    this.productslist();
    this.getSearchFilter()
  },
  methods: {
    jump(url) {
      if(url){
        this.$util.JumpPath(url);
      }
    },
    // 筛选 start
    toggleSortable(){
      this.showSortAbleBox = !this.showSortAbleBox;
    },
    //点击事件处理
    set_where: function(e) {
      switch (e) {
        case 1:
          // #ifdef H5
          return history.back();
          // #endif
          // #ifndef H5
          return uni.navigateBack({
            delta: 1,
          })
          // #endif
          break;
        case 2:
          if (this.price == 0) this.price = 1;
          else if (this.price == 1) this.price = 2;
          else if (this.price == 2) this.price = 0;
          this.stock = 0;
          break;
        case 3:
          if (this.stock == 0) this.stock = 1;
          else if (this.stock == 1) this.stock = 2;
          else if (this.stock == 2) this.stock = 0;
          this.price = 0
          break;
        case 4:
          this.nows = !this.nows;
          break;

      }
      this.loadend = false;
      this.$set(this.where, 'page', 1);
      this.getProductList(true);
    },
    checkSortable(val){
      this.where.defaultOrder = val;
      this.showSortAbleBox = false;
      this.loadend = false;
      this.$set(this.where, 'page', 1);
      this.getProductList(true);
    },
    filterConfirm(data){
      this.showFilterDrawer = false;
      Object.assign(this.where,data);
      this.loadend = false;
      this.$set(this.where, 'page', 1);
      this.getProductList(true);
    },
    // 筛选
    getSearchFilter() {
      if(this.goodsFilterConfig!=0) return
      let data = {
        keyword: this.where.keyword,
        cid: this.where.cid,
        sid: this.where.sid,
        tid: this.where.tid,
        productId: this.where.productId,
        promotions_type: this.where.promotions_type,
        // promotions_id: this.where.promotions_id
      };
      searchFilterApi(data).then(res => {
        this.brandList = res.data.brand;
        this.labelList = res.data.store_label;
        this.promotionList = res.data.promotions;
      }).catch(err => {
        return this.$util.Tips({
          title: err.msg
        });
      })
    },
    getProductList(){
      this.setWhere();
      this.productslist()
    },
    setWhere: function() {
      if (this.price == 0) this.where.priceOrder = '';
      else if (this.price == 1) this.where.priceOrder = 'asc';
      else if (this.price == 2) this.where.priceOrder = 'desc';
      if (this.stock == 0) this.where.salesOrder = '';
      else if (this.stock == 1) this.where.salesOrder = 'asc';
      else if (this.stock == 2) this.where.salesOrder = 'desc';
      this.where.news = this.nows ? 1 : 0;
    },
    // end

    // 展示金额:标题上面
    getPrice,
    observeVideo() {
      let observer = uni.createIntersectionObserver(this, { observeAll: true });
      observer.relativeToViewport().observe('.video', res => {
        if (res.intersectionRatio) {
          uni.createVideoContext(res.id, this).play();
        } else{
          uni.createVideoContext(res.id, this).pause();
        }
      });
    },
    productslist() {
      let limit = this.$config.LIMIT;
      let data = {};
      if (this.typeConfig == 1) {
        data = {
          ids: this.dataConfig.goodsList.ids.join(','),
        };
        // 双列布局，加上筛选字段
        if(this.goodStyleConfig==1){
          data = {
            ids: this.dataConfig.goodsList.ids.join(','),
            ...this.where
          };
        }
      } else {
        data = {
          priceOrder: this.goodsSort == 2 ? 'desc' : '',
          salesOrder: this.goodsSort == 1 ? 'desc' : '',
          brand_id: this.typeConfig == 2 ? this.dataConfig.brandList.brandVal.join(',') : '',
          store_label_id: this.typeConfig == 4 ? this.dataConfig.goodsLabel.activeValue.join(',') : '',
          cate_id: this.typeConfig == 3 ? this.dataConfig.classList.classVal.join(',') : '',
          limit: this.numberConfig
        };
      }
      getProductslist(data).then(res => {
        this.tempArr = [...res.data]

        // 双列布局
        if(this.goodStyleConfig == 1){
          let tempArr = [...res.data]
          getIndexGoodsAd().then(adRes=>{
            // 广告开启 并且 当前页面支持广告
            if(adRes.data.status==1 && this.showAd) {
              // 广告数据,每n个商品插入一组广告
              let adData = adRes.data.value;
              let num = parseInt(adRes.data.num);
              let insertedCount = 0; // 记录已插入的广告数量

              // 特殊处理：第一组广告插入到第二个位置（索引1）
              if (adData.length > 0 && tempArr.length >= 1) {
                tempArr.splice(1, 0, {
                  adData: adData[0],
                  isAd: true
                });
                insertedCount++; // 增加已插入广告计数
              }

              // 插入剩余的广告，每num个商品后插入一组广告
              for(let adIndex = 1; adIndex < adData.length; adIndex++) {
                // 计算插入位置：从第(1 + num)个位置开始，每num个商品插入一组广告
                // 需要考虑已插入广告造成的偏移
                let insertPosition = 1 + (adIndex * num) + insertedCount;

                // 确保插入位置不超过数组长度
                if(insertPosition <= tempArr.length) {
                  tempArr.splice(insertPosition, 0, {
                    adData: adData[adIndex],
                    isAd: true
                  });
                  insertedCount++; // 增加已插入广告计数
                }
              }

              this.tempArr = tempArr;
            }
          })
        }
      });
    },
    goDetail(item) {
      goShopDetail(item, this.$store.state.app.uid).catch(res => {
        uni.navigateTo({
          url: `/pages/goods_details/index?id=${item.id}`
        });
      });
    },
    // 商品详情接口；
    getAttrs(id) {
      let that = this;
      getAttr(id, 0).then(res => {
        // 区分商品类型
        if(res.data.storeInfo.lease_type==0){
          this.attr.goodsType='All';
          this.attr.goodsTypeSelect='lease'
        }else if(res.data.storeInfo.lease_type==1){
          this.attr.goodsType='lease';
          this.attr.goodsTypeSelect='lease'
        }else if(res.data.storeInfo.lease_type==2){
          this.attr.goodsType='mall';
          this.attr.goodsTypeSelect='mall'
        }

        // that.$set(that.attr, 'productAttr', res.data.productAttr);
        // that.$set(that, 'productValue', res.data.productValue);
        // 商城规格，租赁规格
        this.attr.productAttr.mall=res.data.productAttr
        this.attr.productAttr.lease=res.data.productAttrLease || res.data.productAttr
        this.productValue.mall=res.data.productValue
        this.productValue.lease=res.data.productValueLease || res.data.productValue


        that.$set(that, 'is_vip', res.data.storeInfo.is_vip);
        that.$set(that, 'storeInfo', res.data.storeInfo);
        // that.DefaultSelect();
        // 全部类型的商品，只显示租赁的规格
        if(this.attr.goodsType==='All'||this.attr.goodsType==='lease'){
          this.DefaultSelect('lease');
        }else if(this.attr.goodsType==='mall'){
          this.DefaultSelect('mall');
        }
      })
    },
    addCartChange(item, index){
      if(this.bntConfig == 1){
        // 多规格
        if(item.spec_type){
          this.goCartDuo(item);
        }else{
          this.goCartDan(item,index);
        }
      }else{
        this.goDetail(item);
      }

    },
    getCartNum() {
      let that = this;
      getCartCounts().then(res => {
        this.$store.commit('indexData/setCartNum', res.data.count)
      });
    },
    // 瀑布流排序
    waterFall() {
      const i = this.mark;
      if (i == 0) {
        // 初始化，从左边开始插入
        this.leftList.push(this.allList[i]);
        // 更新左边列表高度
        this.getViewHeight(0);
      } else if (i == 1) {
        // 第二个item插入，默认为右边插入
        this.rightList.push(this.allList[i]);
        // 更新右边列表高度
        this.getViewHeight(1);
      } else {
        // 根据左右列表高度判断下一个item应该插入哪边
        if(!this.boxHeight.length){
          this.rightList.length < this.leftList.length
              ? this.rightList.push(this.allList[i])
              : this.leftList.push(this.allList[i]);
        } else {
          const leftOrRight = this.boxHeight[0] > this.boxHeight[1] ? 1 : 0;
          if (leftOrRight) {
            this.rightList.push(this.allList[i])
          } else {
            this.leftList.push(this.allList[i])
          }
        }
        // 更新插入列表高度
        this.getViewHeight();
      }
    },
    // 获取列表高度
    getViewHeight() {
      // 使用nextTick，确保页面更新结束后，再请求高度
      this.$nextTick(() => {
        setTimeout(()=>{
          uni.createSelectorQuery().in(this).select('#right').boundingClientRect(res => {
            res ? this.boxHeight[1] = res.height : '';
            uni.createSelectorQuery().in(this).select('#left').boundingClientRect(res => {
              res ? this.boxHeight[0] = res.height : '';
              this.mark = this.mark + 1;
            }).exec();
          }).exec();
        },100)
      })
    },
  }
};
</script>

<style lang="scss">
$page-padding: 10px;
$grid-gap: 10px;
.wf-page {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 8rpx;
  .wf-item{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}
.wf-item {
  width: calc((100vw - 2 * #{$page-padding} - #{$grid-gap}) / 2);
  //padding-bottom: 20rpx;
  margin-bottom: 16rpx;
  overflow: hidden;
  border: 1rpx solid #eee;
}
.bottom-more{
  .more-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1rpx solid #ddd;
    padding: 16rpx;
    border-radius: 20rpx;
    margin-top: 20rpx;
    color: #666;
  }
  &::after{
    content: "";
    display: block;
    height: 50rpx;
  }
}
.heng-box{
  .heng-item{
    overflow: hidden;
    border: 1rpx solid #eee;
    flex: 0 0 auto;

  }
  .heng-item-more {
    display: flex;
    align-items: center;
    padding: 0 20rpx;
    .more-btn{
      background: var(--view-theme);
      color: #fff;
      font-size: 26rpx;
      padding: 18rpx 12rpx;
      border-radius: 28rpx;
      >view:not(:last-child){
        margin-bottom: 2rpx;
      }
    }
  }
}
.wf-page1 .wf-item{
  margin-top: 20rpx;
  background-color: #fff;
  //border-radius: 20rpx;
  padding-bottom: 0;
}
.item ~ .item{
  margin-top: 32rpx;
}
.info_box{
  padding: 16rpx 20rpx;
  //border-radius: 0 0 20rpx 20rpx;
  background-color: #fff;
}
.bg--w111-484643{
  background: linear-gradient(90deg, #484643 0%, #1F1B17 100%);
}
.text--w111-FDDAA4{
  color: #FDDAA4;
}
.svip_rd{
  border-radius: 14rpx 0 8rpx 14rpx;
}
.cart-btn{
  // background:rgba(255,255,255,0.9);
  width: 100%;
  height: 100%;
}
.price-box{
  align-items: baseline !important;
  .goods-tag{
    border: 1px solid #e93323;
    color: #e93323;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30rpx;
    height: 30rpx;
    margin-left: 16rpx;
    border-radius: 4rpx;
    font-size: 22rpx;
    font-weight: normal;
  }
}

.oval-button {
  width: 100px; /* 宽度可以根据需要调整 */
  height: 30px; /* 高度可以根据需要调整 */
  background-color: pink;
  border-radius: 50px / 50px; /* 第一个值是水平半径，第二个值是垂直半径 */
  color: red; /* 文字颜色 */
  border: none; /* 去掉默认边框 */
  font-size: 16px; /* 字体大小 */
  font-weight: bold;
  display: flex;
  align-items: center;         /* 垂直居中 */
  justify-content: center;     /* 水平居中 */
}
</style>
<style lang="scss" scoped>
//.line2{
//  font-weight: bold !important;
//}

.sortable-box{
  padding: 32rpx 32rpx 0;
  position: absolute;
  top: 88rpx;
  left: 0;
}
</style>